<style>



    #showCRTWindow pre::-webkit-scrollbar {
        width: 10px;
    }
    #showCRTWindow pre::-webkit-scrollbar-thumb {
        background: #09C;
        border-radius: 4px;


    }
</style>

<script src="../js/command.js"></script>


<div id="mainCommand" style="width: 100%;height:100%;">

    <div>
        <div class="input-group">
            <input class="form-control" id="inputCommand" style=""/>
            <span class="input-group-btn" id="execute">
		<button class=" btn btn-primary" style="border-radius:0px;">
			<span class="" id="showExecuteRefresh">执行</span>
		</button>
	</span>
            <span class="input-group-btn" id="selectServersFilter">
		<button class=" btn btn-success" style="border-radius:0px;">
			<span class="glyphicon glyphicon-filter">服务器</span>
		</button>
	</span>
            <span class="input-group-btn" id="addCrond" style="display:none">
		<button class=" btn btn-info" style="border-radius:0px;">
			<span class="glyphicon glyphicon-time">定时</span>
		</button>
	</span>
        </div>


    </div>
    <div style="margin-top: 10px;">
        <ul style="list-style: none; overflow: auto;max-height: 10%;" id="showCommandHistory" class="clearfix">
        </ul>
    </div>


    <!--进度条-->
    <div class="progress" style="margin-bottom: 0px;">
        <div id="commandProgress" class="progress-bar progress-bar-success progress-bar-striped" role="progressbar"
             style="width: 0.1">
            <span id="showCommandProgress" style="color: white;font-weight: bold;">0%</span>
        </div>
    </div>


    <div style="min-height: 60%;display: block;width: 100%;height: 90%;padding-right:20px; padding-bottom:20px; padding-left:20px;;overflow: auto;" class="clearfix">


        <!--全屏按钮-->
        <!--各个CRT窗口 ,这里是样例，不用来显示，用来克隆-->
        <div id="CRTWindowExample"
             style="width: 48%;height: 90%;display: none;margin-bottom:40px;float: left;margin-left: 2%;">
            <div>
                <h4 class=" glyphicon  glyphicon-play-circle" style="color: green;">服务器别名</h4>
            </div>

            <pre class="modal-body"
                 style="margin-bottom: 10px;border-radius: 8px;background: black;color:white;;height:100%;"></pre>
        </div>
        <!--下面的div用来显示全部CRT窗口-->
        <div id="showCRTWindow" style="height: 100%;">


        </div>


    </div>
</div>


<div style="z-index: 1004;width:auto;height: 200px;position: absolute;left: 0px;right: 0px;top: 40%;bottom: 60%;margin: auto;display:none;"
     id="CrondDiv">
    <!--默认不能显示，这里的div z-index 太高了，会挡住界面的某些操作，所以是none，当开启了某些弹出层后，这里需要显示，最后需要关闭-->


</div>


<div id="showServersPannel"
     style="z-index: 1004;position: absolute;left: 0px;right: 0px;top:0px;margin: auto;display:none;">
    <div class="modal  "
         style="overflow: visible;position:relative;left:0px;right:0px;bottom:0px;top:0px;margin:auto;display:block;">
        <div class="modal-dialog" style="left: 0px; margin-top: 0px;padding:0px;padding-top: 0px;">
            <div class="modal-content " id="iphoneBody">
                <div class="modal-header" style="cursor: move;">

                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>

                    <h4 class=" glyphicon glyphicon-filter " style="color: green;cursor:pointer;">选择服务器</h4>
                </div>

                <div class="modal-body">
                    <div style="height: 40px;">
                        <span id="selectAllServers" class="glyphicon glyphicon-check"
                              style="cursor: pointer;">&nbsp;全选</span>
                    </div>
                    <table class="table table-bordered table-hover table-striped  table-condensed">
                        <thead>
                        <tr>
                            <th>主机组</th>
                            <th>主机</th>
                        </tr>
                        </thead>
                        <tbody id="selectServerTbody">

                        <!--
                        这里是tr，每一行

                        -->
                        </tbody>

                    </table>


                    <!---->


                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-success" id="selectedServers">确定
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>


<div id="confirmCommandDiv"
     style="z-index: 1004;width:auto;height: 200px;position: fixed;left: 0px;right: 0px;top: 40%;bottom: 60%;margin: auto;display:none;">
    <div class="modal  "
         style="overflow:hidden;overflow-y:hidden;position:relative;left:0px;right:0px;bottom:0px;top:0px;margin:auto;display:block;">
        <div class="modal-dialog" style="left: 0px; margin-top: 0px;padding:0px;padding-top: 0px;">
            <div class="modal-content ">
                <div class="modal-header" style="cursor: move;">

                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>

                    <h4 class=" glyphicon glyphicon-alert " style="color: red;">警告！</h4>
                </div>

                <div class="modal-body">
                    <p id="showCommandWarn" style="color:red; font-weight:bold;">请确认您的消息?</p id="showWarnContent">
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal" id="forceExecuteCommand">强制
                    </button>
                    <button type="button" class="btn btn-default" data-dismiss="modal" id="closeConfirmCommandButton">
                        放弃
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>

